<template>
  <div>
    <ul>
      <li @click="bookDetail(items.id)">
        <div style="width: 12em;border-bottom: solid 1px lightgray;">
          <span style="font-size: 20px;color: red;">NO:{{ number+1 }}</span>
          <img style="" :src="$store.state.baseImgUrl+items.img" alt="经典">
          <p>{{ items.name }}</p>
          <p style="text-align: right;padding-right: 20px;"><span>销量</span><strong style="    font-size: 20px;color: red;">{{ items.saleCount }}</strong></p>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "LeaestSon1",
  data(){
    return{

    }
  },
  methods:{
    bookDetail(curBookId){
      this.$router.push({path:'/purchasePage',query:{curBookId:curBookId}})
    }
  },
  props:{
    items:{
      type:Object,
      required:true
    },
    number:{

    }
  }
}
</script>

<style scoped>
div ul{
  background-color: white;
}
div ul li{
  padding: 0em 0 0 4px;
}
div div{
  margin-right: 1em;
}
div p:first-child{
  font-size: 24px;
}
</style>